<template>
    <div>
        <el-dialog
            :title="'导出字段为Excel文件，便于线下翻译'"
            :close-on-click-modal="false"
            width="500px"
            v-dialogDrag
            :visible.sync="isShow"
        >
            <el-form size="small" :model="oForm" ref="oForm" label-width="120px">
                <el-form-item
                    label="导出范围"
                    size="small"
                >
                    <el-radio v-model="oForm.type" label="current" border style="margin-right: 10px;">当前页</el-radio>
                    <el-radio v-model="oForm.type" label="all" border>全部</el-radio>
                </el-form-item>

                <el-form-item
                    label="翻译状态"
                    size="small"
                >
                    <el-radio v-model="oForm.transStatus" label="1" border style="margin-right: 10px;">待翻译的</el-radio>
                    <el-radio v-model="oForm.transStatus" label="2" border style="margin-right: 10px;">已翻译的</el-radio>
                    <el-radio v-model="oForm.transStatus" label="0" border>全部</el-radio>
                </el-form-item>

                <el-form-item>
                    <el-button type="primary" @click="submit" size="small" :loading="isLoading">开始导出</el-button>
                    <el-button @click="isShow = false" size="small">取 消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>

<script>
//导出excel
import ajax from '@/utils/ajax.js'
import jsLoader from "@/utils/jsLoader";
import {libPath} from "@/config/config";
import dayjs from 'dayjs'

export default {
    name: "exportExcel",
    data(){
        return {
            isShow: false,
            oForm:{
                type:'current', //范围，current:当前页，all:全部
                transStatus:'1', //翻译状态，1：待翻译的，2：已翻译的，0：全部
            },
            pageSize:undefined,
            pageNo:undefined,
            isLoading:false,
            libName:'',
            libId:'',
            tableData:[], //表格数据
        }
    },
    methods:{
        submit(){
            //如果是当初当前页，前端导出
            if(this.oForm.type === 'current'){
                jsLoader(`${libPath}xlsx.full.min.js`, () => {
//表头
                    const tableHead = {
                        id:'ID（请勿修改）',
                        key:'KEY（请勿修改）',
                        module_name:'模块名（请勿修改）',
                        zh:'中文（Chinese）',
                        en:'英文（English）'
                    }
                    // 要打印的数据格式 对象中的key将会作为表头渲染
                    const printData = []
                    let filterData = this.tableData.filter(item => item.is_has_children !== '1') //过滤掉父节点
                    //过滤待翻译
                    if(this.oForm.transStatus === '1'){
                        filterData = filterData.filter(item => !item.en)
                    }
                    //过滤已翻译
                    else if(this.oForm.transStatus === '0'){
                        filterData = filterData.filter(item => !!item.en)
                    }

                    filterData.forEach(item => {
                        printData.push({
                            [tableHead.id]: String(item.id),
                            [tableHead.key]: item.parent_key?.join('.') + '.' + item.key,
                            [tableHead.module_name]: item.module_name,
                            [tableHead.zh]: item.zh,
                            [tableHead.en]: item.en
                        })
                    })
                    // 创建一个新sheet
                    const newSheet = XLSX.utils.json_to_sheet(printData)
                    // 设置每列的列宽（可选），10代表10个字符，注意中文占2个字符
                    newSheet['!cols'] = [
                        { wch: 10 },
                        { wch: 30 },
                        { wch: 25 },
                        { wch: 30 },
                        { wch: 30 },
                    ]
                    // 新建book
                    const newBook = XLSX.utils.book_new()
                    // 将 sheet 添加到 book 中
                    XLSX.utils.book_append_sheet(newBook, newSheet, '多语言包中英文对照')
                    // 导出excel文件
                    this.$message.success('操作成功，等待下载')
                    XLSX.writeFile(newBook, this.libName + '-' + dayjs().format('YYYYMMDDHHmmss') + '.xlsx')
                })
            }
            //导出所有页
            else{
                const oTransStatus = {'1':'1', '2':'0', '0':undefined}
                //is_empty_en 是否过滤出英文为空的， 1：是，0：否
                const isEmptyStr = this.oForm.transStatus !== '0' && this.oForm.transStatus !== ''?`&is_empty_en=${oTransStatus[this.oForm.transStatus]}`:''
                //根据范围判断是否传翻页信息
                const pageInfo = this.oForm.type === 'current'? `&pageSize=${this.pageSize}&pageNo=${this.pageNo}`: ``
                ajax({
                    url: `fields/exportExcel?lib_id=${this.libId}&lib_name=${this.libName}${isEmptyStr}${pageInfo}`,
                    method:'download'
                })
                this.isShow = false
            }

        }
    },
}
</script>

<style lang="scss" scoped>

</style>
